{include file="public/header"}
<body>
<div id="app" v-cloak>
    <div class="ht-main" v-cloak>
        <div class="ht-tool">
            <div class="ht-tool-left">
                <el-button type="success" size="mini" icon="el-icon-plus" @click="doAdd">添加</el-button>
            </div>
            <div class="ht-tool-right">
            </div>
        </div>
        <div class="ht-form">
            <el-form :model="editData" label-width="110px" ref="myform">
                <el-tabs v-model="activeTab" @tab-click="">
                    <el-tab-pane label="基本设置" name="first">
                        <el-form-item label="系统名称">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="web_name" placeholder="网站名称" v-model="editData.web_name"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    后台显示的名字
                                </el-col>
                            </el-row>
                        </el-form-item>
                        <el-form-item label="客服">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="editData.kefu" placeholder="客服" v-model="editData.kefu"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    调用方法{ kefu }
                                </el-col>
                            </el-row>
                        </el-form-item>
                        <el-form-item label="入职奖励">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="editData.join_money" placeholder="入职奖励" v-model="editData.join_money"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    调用方法{ join_money }
                                </el-col>
                            </el-row>
                        </el-form-item>
                        <el-form-item label="满月奖励">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="editData.month_money" placeholder="满月奖励" v-model="editData.month_money"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    调用方法{ month_money }
                                </el-col>
                            </el-row>
                        </el-form-item>
                    </el-tab-pane>
                    <el-tab-pane label="微信设置" name="second">
                        <el-form-item label="APPID">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="wx_appid" placeholder="APPID" v-model="editData.wx_appid"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    wx_appid
                                </el-col>
                            </el-row>
                        </el-form-item>
                        <el-form-item label="secret">
                            <el-row :gutter="10">
                                <el-col :span="11">
                                    <el-input name="wx_secret" placeholder="wx_secret" v-model="editData.wx_secret"></el-input>
                                </el-col>
                                <el-col :span="11">
                                    调用方法{ wx_secret }
                                </el-col>
                            </el-row>
                        </el-form-item>
                    </el-tab-pane>
                </el-tabs>

                <el-form-item label-width="80px">
                    <el-button type="primary" @click="onSubmit">提交</el-button>
                </el-form-item>
            </el-form>
            <el-drawer
                    :visible.sync="is_edit"
                    size="90%"
                    :with-header="false"
                    custom-class="ht-drawer-bg"
            >
                <div class="ht-drawer-main">
                    <el-page-header @back="goBack" title="Esc返回" :content="content"></el-page-header>
                    <div class="ht-form">
                        <el-form :model="editData" label-width="120px" size="small">
                            <el-form-item label="标题">
                                <el-input type="text" placeholder="标题" v-model="editData.tel"></el-input>
                            </el-form-item>
                            <el-form-item label="键值">
                                <el-input type="text" placeholder="字母开头，英文和数字组成" v-model="editData.key"></el-input>
                            </el-form-item>
                            <el-form-item label="类型">
                                <el-select v-model="editData.type">
                                    <el-option value="select" label="下拉框"></el-option>
                                    <el-option value="input" label="输入框"></el-option>
                                    <el-option value="textarea" label="文件域"></el-option>
                                    <el-option value="image" label="图片"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="选项" v-if="editData.type == 'select'">
                                <el-row style="margin: 0 0 5px 0  !important;" :gutter="10" v-for="(it,index) in editData.option" :key="index">
                                    <el-col :span="4">
                                        <el-input type="text" v-model="editData.option[index]" placeholder="选项"></el-input>
                                    </el-col>
                                    <el-col :span="4">
                                        <el-button type="success" size="mini" v-if="index == 0" @click="itemAdd">添加</el-button>
                                        <el-button type="danger" v-if="index != 0" size="mini" @click="itemDel(index)">删除</el-button>
                                    </el-col>
                                </el-row>
                            </el-form-item>
                            <el-form-item label="默认值">
                                <el-input type="text" placeholder="默认值" v-model="editData.value"></el-input>
                            </el-form-item>
                            <el-form-item label="提示">
                                <el-input type="text" placeholder="提示" v-model="editData.tips"></el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button @click="goBack">取消</el-button>
                                <el-button type="primary" @click="onSubmit">提交</el-button>
                            </el-form-item>
                        </el-form>
                    </div>
                </div>
            </el-drawer>
        </div>
    </div>
</div>
{include file="public/common"}
<script>
    let vs
    new Vue({
        el:"#app",
        data:function () {
            return {
                arctypeList:[],
                activeTab:'first',
                tableData: [],
                is_edit:false,
                editData:{},
                content:'编辑',
                total:0,
                page:1,
                limit:10,
                search_arctype_id:"",
                search_title:"",
                editBody:'13123',
                pre_view:[],
                indexShow:false,
                registerShow:false
            }
        },
        created:function() {
            vs = this
            this.getData()
        },
        methods: {
            itemAdd() {
                vs.editData.option.push("")
            },
            itemDel(index) {
                vs.editData.option.splice(index,1)
            },
            imageManage(){
                this.showDialog = true;
            },
            uploadSuccess(response,file,fileList) {
                if (response.code === 1) {
                    this.editData.web_logo = response.url
                }
                console.log(response,file,fileList)
            },

            onSubmit() {
                var that = this
                $.post('{:url("System/baseAdd")}',that.editData,function (res){
                    if (res.code === 1) {
                        that.showSuccessMsgCall(function (){
                            location.reload()
                        })
                    } else {
                        that.showErrorMsg(result.msg)
                    }
                })

            },
            getData:function() {
                var that = this
                axios.post('{:url("Ajax/getSystemConfig")}').then((res)=>{
                    console.log(res.data)
                    that.editData = res.data.data
                })
            },
            doAdd:function(){
                this.is_edit = true
                this.content = '添加'
                this.editData = {
                    option:[""]
                }
            },
            edit:function(data) {
                this.is_edit = true
                this.content = '编辑'
                this.editData = data
                console.log(data)
            },
            goBack:function(){
                this.is_edit = false
            },
            del:function(data) {
                var that = this
                that.$confirm('确定删除么?','提示',{
                    type:'warning',
                    lockScroll:false
                }).then(()=>{
                    axios.post('{:url("Auth/authRuleDel")}',{id:data.id}).then((res)=>{
                        let result = res.data;
                        if (result.code == 1) {
                            that.showSuccessMsgCall(function (){
                                location.reload()
                            })
                        } else {
                            that.showErrorMsg(result.msg)
                        }
                    })
                })
            },
            handleSizeChange:function(e) {
                this.limit = e
            },
            handleCurrentChange:function(e) {
                this.page = e
            }
        },
        watch:{
            page(v) {
                this.getData()
            },
            limit() {
                this.getData()
            }
        }
    })
</script>
</body>
</html>
